{% comment %}
	Important that the form id is specified the way it is. The client code uses this id to
	grab the form values when setting props.
{% endcomment %}

<form id="{{wid}}-props-form">
	<div class="item">
		<div class="label">Display Style</div>
		<select name="display-style">
			<option value="trend"     >Trend</option>
			<option value="map"       >Map</option>
			<option value="total-pie" >Total - Pie Chart</option>
		</select>
	</div>
	{% include "duration.html" %}
	{% include "action.html" %}

<script>

(function()
{
	var $time_span = $("#{{wid}}-props-form-time-span");
	hide_all();
	$("#{{wid}}-props-form [name='display-style']").change(function(e)
	{
		hide_all();
		switch(e.target.value)
		{
			case 'trend':
				$time_span.show();
				break;
		}
		$_grid.widget_grid('updateProps', '{{wid}}');
	});
	function hide_all()
	{
		$time_span.hide();
	}
})();


	</script>

</form>
